<template>
	<view class="viewcontent">
		<view class="viewcontenthead">
			<view class="fl" @click="$UTILS.goBack(1)"></view>
			<view class="fr" style="color: #fdf5fa;"> 任务信息查询</view>
			<view class="leftitem" @click="selecteditem">
				<image src="../../../static/download.svg" style="height:32rpx;width: 32rpx;"></image>
			</view>
		</view>
		<view class="viewcontenmes">
			<view class="searchitem">
				<view class="easyinputmes"><uni-easyinput v-model="value" placeholder="请输入内容"
						@input="input"></uni-easyinput></view>
				<view class="easyinputimg">
					<image @click="searchdemo" src="../../../static/Search.svg" style="height:52rpx;width: 52rpx;">
					</image>
				</view>

			</view>
			<view class="listitem">
				<view class="listitemdemo" v-for="(item,index) in this.itemlist" :key="index"
					@click="checkedselect(item)"
					:style="taskCode==item.taskCode?'border: 1px solid rgba(0, 255, 127, 0.8)':''">
					<view class="listitemdemoitem1">
						<view class="listitemdemoitem1item1">
							<view>序号：{{index+1}}</view>
							<view>
								<image src="../../../static/success-Green.svg" style="height:52rpx;width: 52rpx;"
									v-if="taskCode==item.taskCode"></image>
								<image src="../../../static/success-Gray.svg" style="height:52rpx;width: 52rpx;" v-else>
								</image>
							</view>
						</view>
						<view class="listitemdemoitem1item2">
							<view>任务名称：{{ item.taskName }}</view>
						</view>
					</view>
					<view class="listitemdemoitem2">
						<view class="listitemdemoitem2item1">
							<view class="listitemdemoitem2item1mes1">
								<view>任务编码：{{item.taskCode}}</view>
							</view>
							<view class="listitemdemoitem2item1mes2">
								当前状态：{{item.taskStatus==0?'任务取消':item.taskStatus==1?
							'配备物资':item.taskStatus==2?'配备物资':item.taskStatus==3?'配备设备':item.taskStatus==4?'设备出库':item.taskStatus==5?'任务执行':'任务结束'}}
							</view>
						</view>
						<view class="listitemdemoitem2item2">
							<u-button @click.native.stop="redirecttaskmessage(index)">查看详情</u-button>
						</view>
					</view>
				</view>
			</view>

		</view>
		<myLoading v-if="loading" style="position: absolute;z-index: 9;"></myLoading>
	</view>
</template>

<script>
	export default {
		onShow() {
			this.itemlist = this.$UTILS.getitemlist()
			// this.taskCode = this.$UTILS.gettaskCode() || this.itemlist[0].taskCode
			if (this.$UTILS.gettaskCode()) {
				this.taskCode = this.$UTILS.gettaskCode()
			}

		},
		data() {
			return {
				value: '',
				itemlist: [],
				selectindex: 0,
				taskCode: 0,
				loading: false,
				taskId:0
			}
		},
		methods: {
			input(e) {
				this.value = e
			},
			searchdemo() {

				if (this.value == '') {
					this.itemlist = this.$UTILS.getitemlist()
					return
				}
				this.itemlist = this.$UTILS.getitemlist().filter(item => {
					return item.taskName.includes(this.value)
				})
			},
			async selecteditem() {
				let command = {
					appCode: 'ict'
				}
				let [err, res] = await this.$UTILS.requestRestgetnoparam(this.$COMMON.REST_URL.TASKLIST, 'GET',
					command)
					
				if (res && res.statusCode == 200) {
					if (res.data?.code == 401) {
						let jqdizhi = this.$UTILS.getunlinelogin()
						let ictdizhi = this.$UTILS.getunlineaddress()
						uni.clearStorageSync()
						this.$UTILS.setunlinelogin(jqdizhi);
						this.$UTILS.setunlineaddress(ictdizhi);
						setTimeout(() => {
							uni.reLaunch({
								url: '/pages/view-layout/login/login',
							});
						}, 1000)
						
						this.$UTILS.toast('token过期，请从新登录')
						return
					}
					this.itemlist = res.data.result
					this.$UTILS.toast('数据获取成功')
				} else {
					this.$UTILS.toast('数据获取失败')
				}


				this.$UTILS.setitemlist(this.itemlist);

			},
			checkedselect(item) {
				this.loading = true
				this.taskCode = item.taskCode
				this.taskId = item.taskId
				this.$UTILS.settaskId(this.taskId)
				this.$UTILS.settaskCode(this.taskCode)
				setTimeout(() => {
					this.loading = false
				}, 1000)

			},
			redirecttaskmessage(index) {
				let data = this.itemlist[index]
				uni.navigateTo({
					url: `/pages/view-working/Taskviewingmessage/Taskviewingmessage?data=${JSON.stringify(data)}`
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.viewcontent {
		display: flex;
		flex-direction: column;
		width: 100%;
		height: 100vh;
		box-sizing: border-box;
		padding-top: 55rpx;

		.viewcontenthead {
			width: 100%;
			height: 5%;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.fl {
				width: 100rpx;
				height: 10vh;
				line-height: 10vh;
				background: url("/static/right-arrow.png") no-repeat center;
				background-size: 14%;
				transform: rotate(180deg);
				cursor: pointer; // 增加鼠标指针样式
			}

			.fr {
				cursor: pointer; // 增加鼠标指针样式
			}

			.leftitem {
				width: 100rpx;
				display: flex;
				justify-content: center;
				z-index: 999;
			}
		}

		.viewcontenmes {
			width: 100%;
			height: 95%;

			.searchitem {
				width: 100%;
				height: 10%;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;

				.easyinputmes {
					width: 660rpx;
					box-sizing: border-box;
					padding: 0 25rpx;
				}

				.easyinputimg {
					width: 80rpx;
				}
			}

			.listitem {
				width: 100%;
				height: 90%;
				overflow: auto;
				display: flex;
				flex-direction: column;

				.listitemdemo {
					border: 1px solid white;
					border-radius: 15px;
					width: 98%;
					height: 120px;
					margin: 0 auto;
					margin-top: 15rpx;
					box-sizing: border-box;
					padding: 0 5rpx;
					font-family: PingFang SC;
					font-weight: 550;
					color: rgba(250, 249, 249, 0.8);
					font-size: 20px;

					.listitemdemoitem1 {
						width: 100%;
						height: 50%;

						.listitemdemoitem1item1 {
							width: 100%;
							height: 50%;
							display: flex;
							box-sizing: border-box;
							padding-right: 25rpx;
							padding-left: 55rpx;
							justify-content: space-between;
							align-items: center;
						}

						.listitemdemoitem1item2 {
							width: 100%;
							height: 50%;
							box-sizing: border-box;
							padding-left: 55rpx;
							display: flex;
							align-items: center;

							view {
								overflow: hidden;
								white-space: nowrap;
								text-overflow: ellipsis;
							}
						}
					}

					.listitemdemoitem2 {
						width: 100%;
						height: 50%;
						display: flex;
						flex-direction: row;

						.listitemdemoitem2item1 {
							width: 75%;
							height: 100%;

							.listitemdemoitem2item1mes1 {
								width: 100%;
								height: 50%;
								box-sizing: border-box;
								padding-left: 55rpx;
								display: flex;
								align-items: center;
								flex-direction: row;

								view {
									overflow: hidden;
									text-overflow: ellipsis;
									white-space: nowrap;
								}
							}

							.listitemdemoitem2item1mes2 {
								width: 100%;
								height: 50%;
								box-sizing: border-box;
								padding-left: 55rpx;
								display: flex;
								align-items: center;
							}
						}

						.listitemdemoitem2item2 {
							width: 25%;
							height: 100%;
							display: flex;
							align-items: center;
						}
					}
				}
			}
		}
	}

	.borderstyle {
		border: 1px solid rgba(0, 255, 127, 0.8);
	}

	::v-deep .uni-input-input {
		color: rgba(250, 249, 249, 0.8) !important;
	}
</style>